<template>
  <div class="app-container">
    <div class="set-power">
      <div class="addBUtton">
        <el-tooltip class="item" effect="dark" content="新增" placement="top-start">
            <el-button type="primary" @click="addRole"  size="small" icon="el-icon-plus"></el-button>
        </el-tooltip>
      </div>
      <div class="roleName ">
        <v-table :tableParams="tableParams" v-on:handleOperation="handleOperation"></v-table>
      </div>
    </div>

    <!-- 弹窗 -->
    <add-role v-if="show" @closeDialog="closeDialog"  :parentlist="parentlist"></add-role>
    <modify-role v-if="showTip" @closeDialog="closeDialog" :row="row" :treeData="treeData" :parentlist="parentlist"></modify-role>
  </div>
</template>
<script>
import VTable from "components/common/PageTable/VTable"
import addRole from 'components/base/RoleManage/AddRole.vue'
import modifyRole from 'components/base/RoleManage/ModifyRole.vue'
  export default {
    data() {
      return {
        show:false,
        showTip:false,
        makeShow:false,
        props: {
          label: 'label',
          children: 'children'
        },
        row:{}, //props
        treeData:[],
        parentlist:[],
        childMenu:[],
        tableParams:{
          dataArray:[],
          showMultiSelection:false,
          columnArray:[
              {label: '序号', prop: 'id',  sortable: false},
              {label: '角色名', prop: 'roleDesc',  sortable: false},
              {label: '描述', prop: 'roleDescribe',  sortable: false},
              {label: '创建时间', prop: 'createtime',sortable: false}
          ],
          rowHandle:{
              deleted:{
                  show:false
              },
              update:{
                  show:false
              }
          }
        },
      };
    },
    created() {
      this.getList();
      this.getAllPermisson()
    },
    filters:{
      createtime(val){
        return val.slice(0,10)
      },
    },
    methods: {
      getList() {
        let success=data=>{
          if(data.code=="OK"){
            this.tableParams.dataArray=data.data
            data.data.forEach(element => {
              element.createtime=element.createtime.substr(0,19)
            });
          }else{
            this.$message.error(data.msg)
          }
        }
        this.api.roleNewList({},success)
      },
      handleOperation(rowIndex, row, methodName) {
        this.row=row
        this.id=row.id
        if(methodName == "view"){
          this.makeRole()
        }
      },
      //获取所有权限
      getAllPermisson() {
        let success=data=>{
            if(data.code == "OK"){
                for(var i  in data.data){
                    if(data.data[i].userType == 1){
                        var param = {
                          id : Number,
                          label: String,
                          children: []
                        }
                        param.id = data.data[i].id;
                        param.label = data.data[i].name;
                        this.childMenu=data.data[i].childMenu
                        for(var j in this.childMenu){
                              if(this.childMenu[j].parentId==data.data[i].id){
                                var child = {
                                    id : Number,
                                    label : String
                                }
                                child.id=this.childMenu[j].id
                                child.label=this.childMenu[j].name
                                param.children.push(child)
                              }
                            }
                        }
                  this.parentlist.push(param)
                }
            }else{
                this.$message.error(data.msg)
            }
          }
          this.api.resourcesList({},success)
        },
      //新增
      addRole(){
       this.show=true
      },
      closeDialog(){
        this.show=false;
        this.showTip=false;
        this.makeShow=false;
      },
      //修改
      makeRole(){
        this.showTip=true
        this.row=this.row
        let parmas={
          id:this.id
        }
        let success=data=>{
          if(data.code=="OK"){
            this.treeData=data.data
          }else{
            this.$message.error(data.msg)
          }
        }
        this.api.roleSelect(parmas,success)
      },
    },
    components:{
      addRole,modifyRole,VTable
    }
  }
</script>
<style lang="scss" scoped>
.app-container{
  .set-power{
    .addBUtton{
      line-height: 45px;
    }
  }
}
</style>

